<template>
  <a-spin :spinning="confirmLoading">
    <j-form-container :disabled="disabled">
      <a-form-model layout="horizontal" ref="subForm" slot="detail" :model="model" :rules="validatorRules" v-bind="formItemLayout">
        <z-form-item :datas="fieldArr" :form="model" :rules="validatorRules" :gutter="0">
          <!--//自定义姓名-->
          <template slot="slots-realName"> {{Object.keys(model).length>0 && model.realName?model.realName: ''}} </template>
          <!--//自定义身份证-->
          <template slot="slots-identityCard"> {{Object.keys(model).length>0 && model.identityCard?model.identityCard: ''}} </template>
          <!--//自定义用户名-->
          <template slot="slots-username"> {{Object.keys(model).length>0 && model.username?model.username: ''}} </template>
        </z-form-item>
      </a-form-model>
    </j-form-container>
  </a-spin>
</template>

<script>
 import { modifyAccount } from '@/api/sjsk/personService'
  export default {
    props: {
      disabled: {
        type: Boolean,
        default: false,
        required: false
      }
    },
    data () {
      return {
        model: {},
        confirmLoading: false,
        formItemLayout: {
          labelCol: { span: 5 },
          wrapperCol: { span: 16 }
        },
        fieldArr: [
          {label: '姓名', prop: 'realName'},
          {label: '身份证', prop: 'identityCard'},
          // {label: '用户名', prop: 'username'},
          {
            label: '状态', 
            prop: 'accountStatus', 
            tagType: 'dict-select', 
            dictOptions: [
              { text: '激活', value: '1' },
              { text: '锁定', value: '2' },
            ]
          },
          {
            label: '签到类型', 
            prop: 'signType', 
            tagType: 'dict-select', 
            dictOptions: [
              { text: 'APP', value: '1' },
              { text: '短信', value: '2' },
              { text: '小程序', value: '3' },
            ]
          },
          {label: '手机号码', prop: 'phone', tagType: 'input'},
        ],
        validatorRules: {
          accountStatus:[ { required: true, message: '请选择状态!' }],
          signType:[ { required: true, message: '请选择签到类型!' }],
          phone:[ { required: true, message: '请填入手机号码!' },]
        }
      }
    },
    methods: {
      show (record) {
        console.log(record)
        this.$set( this.model, 'realName', record.realName )
        this.$set( this.model, 'identityCard', record.identityCard )
        this.$set( this.model, 'sjskPersonId', record.id )
      },
      submitForm () {
        const parameter = Object.assign({}, this.model)
        this.$refs.subForm.validate((valid)=> {
          if (valid) {
            this.confirmLoading = true
            modifyAccount(parameter).then(res => {
              this.confirmLoading = false
              if (res.success) {
                this.$message.success(res.message)
                this.$emit('ok');
              } else {
                this.$message.warn(res.message)
              }
            })
            .catch(e => {
              this.$message.warn('请求失败！')
              this.confirmLoading = false
            })
          } else {
            console.log('error submit!!')
            return false
          }
        })
      }
    }
  }
</script>
